<div>
<h1>报警list</h1>
    <template style="margin: 10px; display:block;">
        <el-select style="display:block" v-model="value" placeholder="请选择" @change="getmsg">
            <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
            </el-option>
        </el-select>
    </template>

    <!--<h1>carservice报警list</h1>-->
    <el-input style="margin-top: 20px;width: 300px" v-model="input" placeholder="模糊搜索报警名称如 mysql"></el-input>
    <el-input style="margin-top: 20px;width: 300px" v-model="username" placeholder="模糊搜索报警接受人 zhangsan"></el-input>
    <el-button v-on:click="getmsg">查询报警</el-button>
    <!--<el-button v-on:click="getall">更新数据</el-button>-->
    <!-- <el-button ><a href=">test</a></el-button> -->

    <el-button type="text" @click="dialogVisible = true">点击更新数据</el-button>

    <el-dialog
            title="提示"
            :visible.sync="dialogVisible"
            width="30%"
            :before-close="handleClose">
        <span>确定要更新数据么？</span>
        <span slot="footer" class="dialog-footer">
    <el-button @click="canceldialog">取 消</el-button>
    <el-button type="primary" @click="getall">确 定</el-button>
  </span>
    </el-dialog>


    <el-dialog :visible.sync="visible" title="Hello world">
        <p>Try Element</p>
    </el-dialog>
        <template>
            <el-table :data="tableData" style="width: 100%" :row-class-name="tableRowClassName">
                <el-table-column prop="name" label="报错名称" width="280">
                </el-table-column>
                <el-table-column prop="description" label="报错描述" width="180">
                </el-table-column>
                <el-table-column prop="formula" label="报错匹配公式">
                </el-table-column>
                <el-table-column prop="getteam" label="接受信息组" width="180">
                </el-table-column>
                <el-table-column prop="getuser" label="接受信息用户"  width="280">
                </el-table-column>
                <el-table-column prop="logpath" label="日志路径" width="280">
                </el-table-column>
                <el-table-column prop="matchstr" label="匹配字符串" width="180">
                </el-table-column>
                <el-table-column prop="threshold" label="阈值">
                </el-table-column>
                <el-table-column
                        fixed="right"
                        label="操作"
                        width="100">
                    <template slot-scope="scope">
                        <el-button @click="jump(scope.row)" type="text" size="small">查看业务代码</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </template>
</div> 
<style>
    .el-table .warning-row {
        background: oldlace;
    }

    .el-table .success-row {
        background: #f0f9eb;
    }
</style>
<script>
import {config} from '../util'
import axios from 'axios'
import fetchJsonp from 'fetch-jsonp';
import leftside from './layout/leftside';

  export default {
    components: {
     leftside
    },
   
    data() {
     return {
                judgearr:[],
                input:'',
                visible: false,
                tableData: []
            }
    },
    

    methods:{
            tableRowClassName({row, rowIndex}) {
                var $this=this
                var confarr= $this.judgearr
                console.log(row)
                console.log(rowIndex)
//                if (confarr.indexOf(rowIndex)!=-1) {
//                    return 'warning-row';
//                } else {
//                    return 'success-row';
//                }
                if (row.isused=="未使用") {
                    return 'warning-row';
                } else {
                    return 'success-row';
                }
                return '';
            },
            getmsg:function(){
                var $this=this
                var thirdid=this.input
                if(thirdid==''){
                    alert('请输入要查询的mobile')
                    return
                }
                var requerturl="http://10.99.110.223:8889/getmsgbythirdid.php?jsonp=1&thirdid="+thirdid
                fetchJsonp(requerturl)
                .then(function(response) {
                  return response.json()
                }).then(function(json) {
                  // var json=JSON.parse(json)
                        $this.tableData=[]
                        for(var i=0;i<json.length;i++){
                            $this.judge=[]
                            if(json[i].isused=='0'){
                                json[i].isused="未使用"
                                $this.judgearr.push(i)
                            }else{
                                json[i].isused="已经使用"
                            }
                            $this.tableData.push(json[i])
                            
                        }
                        $this.tableRowClassName
                }).catch(function(ex) {
                  console.log('parsing failed', ex)
                  $this.fullscreenLoading = false;

                })
                      
            }
        }
  };
</script>
